@import './reset.css';

:root{
  @green: #02a774;
  @yellow: #F5A100;
  @bc: #e4e4e4;
}


/* 清除浮动 */
.clearfix {
  display: block;
  zoom: 1;

  &::before {
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    clear: both;
    visibility: hidden;
  }
}

// 一像素下边框
.bottom-border-1px(@color){
  position:relative;
  border:none;
  &:after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: @color;
    -webkit-transform: scale(0.5);
    transform: scale(0.5)
  }
}
  
// 一像素上边框
.top-border-1px(@color){
  position: relative;
  &::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 1px;
    background-color: @color;
    -webkit-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    z-index: 200;
  }
}


//根据像素比缩放1px像素边框
@media only screen and (-webkit-device-pixel-ratio: 2) {
  .border-1px::after {
    transform: scaleY(0.5);
  }
}

@media only screen and (-webkit-device-pixel-ratio: 3) {
  .border-1px::after {
    transform: scaleY(0.333333);
  }
}

//根据像素比来使用 2x图 3x图

.bg-image(@url){
  background-image:~"url(@{url}@2x.png)";
  @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3){
  background-image:~"url(@{url}@3x.png)";
  }
  }